<template>
	<div class="editapighostel">

		<div class="waitwritelist">
			<div class="inputbox flcm">
				<div class="label fsize28l">产品名称：</div>
				<input type="text" placeholder="输入内容" class="standard"/>
			</div>
			<div class="inputbox flcm">
				<div class="label fsize28l">价格：</div>
				<input type="text" placeholder="输入内容" class="standard"/>
			</div>
			<div class="inputbox flcm pickbox">
				<div class="label fsize28l">顺序(越大越前)：</div>
				<picker @change="bindPickerChange" :range="array">
						<input type="text" placeholder="输选择" v-model="now"  class="standard smallinput"/>
						<image src="../../../static/administrator/down.png" class="img32 pickdownbtn" mode=""></image>	
				</picker>

			</div>
			<div class="inputbox flcm">
				<div class="label fsize28l">售卖状态：</div>
				<input type="text" placeholder="请选择" class="standard"/>
			</div>
			<div class="inputbox fl">
				<div class="label fsize28l">封面图：</div>
				<image :src="changeimg" class="img200" mode="" @click="changeImg"></image>
			</div>
			<div class="inputbox fl">
				<div class="label fsize28l">简介：</div>
				<textarea name="" id="" cols="30" rows="10" class="text standard" placeholder="输入内容输入内容输入内容输入内"></textarea>
			</div>
		</div>
		
		
		<div class="savebtn fsize32p">保存</div>
			
	</div>


</template>

<script>
	import addimg from '../../../static/administrator/addimg.png'
	export default {
		data() {
			return {
				now: '',
				changeimg:addimg,
				array:['有库存','没库存']
			};
		},
		onLoad: function() {

		},
		methods: {
			changeImg() {
			    uni.chooseImage({
			        success: (chooseImageRes) => {
			            const tempFilePaths = chooseImageRes.tempFilePaths;
			            this.changeimg = tempFilePaths[0]
			            console.log('tempFilePaths[0]',tempFilePaths[0])
			
			            uni.uploadFile({
			              //仅为示例，非真实的接口地址
			                url:'/api/gongzhuyangzhi_backend/mi4inter.php?c=upload&a=uploadProductPic',
			                filePath: tempFilePaths[0],
			                name: 'file',
			                formData: {
			                    filedata: 'storage/emulated/0/DCIM/Camera/IMG_20200605_044714.jpg'
			                },
			                header:{"Content-Type": "multipart/form-data"},
			                success: (uploadFileRes) => {
			                    console.log(uploadFileRes.data);
			                }
			            });
			        }
			    });
			},
			gotogoods(e) {
				uni.navigateTo({
					url: '../goods/goods' 
				});
			},
			bindPickerChange(e) {
				this.now = this.array[e.target.value]
			},
		}
	}
</script>

<style lang="less">
	.pickdownbtn {
		right: 24rpx;
		top: 54rpx;
	}
	.editapighostel {
		box-sizing: border-box;
		.savebtn {
			margin-left: 32rpx;
		}
	}
	
	.mgl32 {
		margin-left: 32rpx;
	}
	.standard {
		width:462rpx;
		height:80rpx;
		box-sizing: border-box;
		border-radius:12rpx;
		border:2rpx solid rgba(190,190,190,0.3);
		padding-left: 24rpx;
		font-size:28rpx;
		font-family:PingFangSC-Regular,PingFang SC;
		font-weight:400;
		color:rgba(153,153,153,1);
		-webkit-box-shadow: inset 0 2rpx 2rpx rgba(0, 0, 0, .075);
		box-shadow: inset 0 2rpx 2rpx rgba(0, 0, 0, .075);
		-webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
		-o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
		transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s
	}
	.text {
		padding:16rpx;
		height: 231rpx;
	}
	.waitwritelist {
		padding:0 32rpx;
		.inputbox {
			// margin-top: 32rpx;
			padding-top: 32rpx;
			.label {
				width: 224rpx;
				line-height: 80rpx;;
			}
		}
	}
</style>
